import type { ExtractPropTypes } from 'vue'
import {
    baseProps,
    makeBooleanProp,
    makeNumberProp,
    makeNumericProp,
    makeStringProp,
} from '../common/props'

export const watermarkProps = {
    ...baseProps,
    /**
     * 显示内容
     */
    content: makeStringProp(''),
    /**
     * 显示图片的地址，支持网络图片和base64（钉钉小程序仅支持网络图片）
     */
    image: makeStringProp(''),
    /**
     * 图片高度
     */
    imageHeight: makeNumberProp(100),
    /**
     * 图片高度
     */
    imageWidth: makeNumberProp(100),
    /**
     * X轴间距，单位px
     */
    gutterX: makeNumberProp(0),
    /**
     * Y轴间距，单位px
     */
    gutterY: makeNumberProp(0),
    /**
     * canvas画布宽度，单位px
     */
    width: makeNumberProp(100),
    /**
     * canvas画布高度，单位px
     */
    height: makeNumberProp(100),
    /**
     * 是否为全屏水印
     */
    fullScreen: makeBooleanProp(true),
    /**
     * 水印字体颜色
     */
    color: makeStringProp('#8c8c8c'),
    /**
     * 水印字体大小，单位px
     */
    size: makeNumberProp(14),
    /**
     * 水印字体样式（仅微信和h5支持），可能的值：normal、italic、oblique
     */
    fontStyle: makeStringProp('normal'),
    /**
     * 水印字体的粗细（仅微信和h5支持）
     */
    fontWeight: makeNumericProp('normal'),
    /**
     * 水印字体系列（仅微信和h5支持）
     */
    fontFamily: makeStringProp('PingFang SC'),
    /**
     * 水印旋转角度
     */
    rotate: makeNumberProp(-25),
    /**
     * 自定义层级
     */
    zIndex: makeNumberProp(1100),
    /**
     * 自定义透明度，取值 0~1
     */
    opacity: makeNumberProp(0.5),
}

export type WatermarkProps = ExtractPropTypes<typeof watermarkProps>
